import { ComponentProps, VueComponent } from "vue3-oop"
import { FormItem, Upload, Button } from 'ant-design-vue';
import { UploadOutlined } from '@ant-design/icons-vue'
import { WidgetNode } from '../../types'
import { UPLOAD } from "./attr-upload";

interface IProps {
  widgetNode: WidgetNode
}
export default class FvrUpload extends VueComponent<IProps> {
  static defaultProps: ComponentProps<IProps> = {
    widgetNode: {}
  }

  constructor(
  ) {
    super();
  }

  render() {
    const { widgetNode } = this.props;
    const { widgetItem } = widgetNode;
    const attr = widgetItem[widgetItem.type] as UPLOAD;

    const labelAlign = attr.formitem_labelAlign;
    const labelCol = { style: { width: `${attr.formitem_labelWidth}px` } }
    const isRequired = attr.layout_status==='4'

    return (
      <FormItem
        labelCol={labelCol} 
        labelAlign={labelAlign} 
        label={attr.field_label}
      >
        <Upload ><Button size="small"><UploadOutlined/>点击上传</Button></Upload>
      </FormItem>
    )
  }
}